<template>
	<!-- 退房 -->
	<div>
		<el-form :inline="true" size="mini">
			<el-form-item>
				<el-input v-model="roomid"  clearable placeholder="输入客户或房间编号"></el-input>
			</el-form-item>
			<el-form-item>
				<el-button type="primary" @click="select()">查找</el-button>
			</el-form-item>
			
			<el-table :data="checks.list" style="100%">
				<el-table-column
				label="入住单号"
				prop="id"
				width="80"
				></el-table-column>
				<el-table-column
				label="房间号"
				prop="roomcode"
				width="80"
				></el-table-column>
				<el-table-column
				label="客房类型"
				prop="roomtype"
				width="80"
				></el-table-column>
				<el-table-column
				label="标准价"
				prop="standardprice"
				width="80"
				></el-table-column>
				<el-table-column
				label="折后价"
				prop="discountprice"
				width="80"
				></el-table-column>
				<el-table-column
				label="押金"
				prop="yajin"
				width="80"
				></el-table-column>
				<el-table-column
				label="入住人"
				prop="dueperson"
				width="80"
				></el-table-column>
				<el-table-column
				label="证件类型"
				prop="cretype"
				width="80"
				></el-table-column>
				<el-table-column
				label="证件号码"
				prop="crenum"
				width="260"
				></el-table-column>
				<el-table-column
				label="联系电话"
				prop="phone"
				width="120"
				></el-table-column>
				<el-table-column
				label="抵店时间"
				prop="arrivetime"
				width="220"
				></el-table-column>
				<el-table-column
				label="离店时间"
				prop="leavetime"
				width="220"
				></el-table-column>
				<el-table-column
				label="入住人数"
				prop="roomnum"
				width="80"
				></el-table-column>
				<el-table-column
				label="会员编号"
				prop="vipcode"
				width="80"
				></el-table-column>
				<el-table-column
				label="会员价格"
				prop="vipprice"
				width="80"
				></el-table-column>
				<el-table-column
				label="操作"
				prop="vipprice"
				width="80"
				>
				<template slot-scope="scope">
					<el-button @click="opens(scope.row)">退房</el-button>
				</template>
				</el-table-column>
			</el-table>
			<el-dialog :visible.sync="open" title="退房" center>
				<el-form :inline="true" align="center" :model="out" :rules="rules" ref="loginForm">
					<el-form-item label="入住单号">
						<el-input readonly v-model="out.id"></el-input>
					</el-form-item>
					<el-form-item label="房间号">
						<el-input readonly v-model="out.roomcode"></el-input>
					</el-form-item>
					<el-form-item label="房价">
						<el-input readonly v-model="out.housing"></el-input>
					</el-form-item>
					<el-form-item  label="押金">
						<el-input  readonly v-model="out.yajin" prop="yajin"></el-input>
					</el-form-item>
					<el-form-item  label="住宿天数">
						<el-input v-model="out.putdya"></el-input>
					</el-form-item>
					<el-form-item label="住宿费用">
						<el-input v-model="out.hotelfee" prop="hotelfee"></el-input>
					</el-form-item>
					<el-form-item label="店内消费">
						<el-input v-model="out.hotelcost"></el-input>
					</el-form-item>
					<el-form-item label="餐费">
						<el-input v-model="out.foodcost"></el-input>
					</el-form-item>
					<el-form-item label="电话费">
						<el-input v-model="out.phonecost"></el-input>
					</el-form-item>
					<el-form-item label="实际应收" prop="shijicost">
						<el-input v-model="out.shijicost" ></el-input>
					</el-form-item>
					<el-form-item label="应退押金" prop="backyajin">
						<el-input v-model="out.backyajin" ></el-input>
					</el-form-item>
					<el-form-item label="付款方式" prop="feetype">
						<el-select v-model="out.feetype.id" @change="aaa()">
							<el-option
							   v-for="item in Fee"
							  :key="item.id"
							  :label="item.feename"
							  :value="item.id"
							></el-option>
						</el-select>
					</el-form-item>
					<el-form-item label="实收" prop="shijifee">
						<el-input v-model="out.shijifee" placeholder="实收"></el-input>
					</el-form-item>
					<el-form-item label="找零"  prop="zhaoling">
						<el-input v-model="zhaoling" placeholder="找零"></el-input>
					</el-form-item>
				
					<el-form-item label="操作员">
						<el-input readonly v-model="out.caozuo" placeholder="操作员"></el-input>
					</el-form-item>
					<el-form-item label="备注">
						<el-input v-model="out.remarks" placeholder="备注"></el-input>
					</el-form-item>
					<br />
					<el-form-item>
						  <el-button type="success" icon="el-icon-check" @click="quit()" circle></el-button>
					</el-form-item>
				</el-form>
			</el-dialog>
		</el-form>
	</div>
</template>

<script>
	export default{
		data(){
			return{
			roomid:'',
			checks:{
				list:[]
			},
			open:false,
			//插入退房对象
			out:{
				feetype:{}
			},
			//收费方式
			Fee:{},
			
			//修改入住对象
			updat:{},
			//把修改对象和插入对象放在一起
			stp:{},
			//判断不能为空
			rules:{
			
				yajin:[
					{required:true,message:'不能空',trigger:['blur','change']},
				],
				backyajin:[
					{required:true,message:'不能空',trigger:['blur','change']},
				],
				feetype:[
					{required:true,message:'不能空',trigger:['blur','change']},
				],
				shijifee:[
					{required:true,message:'不能空',trigger:['blur','change']},
				],
				shijicost:[
					{required:true,message:'不能空',trigger:['blur','change']},
				],
				
				
				
			}
				
			}
		},
		computed:{
			zhaoling(){
				return isNaN(this.out.shijifee - this.out.shijicost)?0:this.out.shijifee - this.out.shijicost; 
			}
		},
		methods:{
			//查找
			select(){
				if(this.roomid!=''){
					let url="Checkin/select"
					axios.post(url,`checkinId=${this.roomid}`).then(resp=>{
						this.checks.list=resp.data.data
					})
				}else{
					this.$alert("填写查询条件")
				}
				
			},
			aaa(){
				console.log(this.out);
			},
			opens(row){
				//打开退房窗口
				this.open =true;
			 
				this.out={...row}
				console.log(this.out);
				this.updat={...row}
				//out 里添加一个feetype对象
				this.$set(this.out,'feetype',{})
				
			
				// console.log(this.out);
				let url="checkout/getAll"
				axios.post(url).then(resp=>{
					this.Fee = resp.data.data
					console.log(this.Fee);
				})
				this.jisuan()
				
			},
			//计算操作
			jisuan(){
				var date1 = new Date(this.out.arrivetime)
				var date2 = new Date()
				var s1 = date1.getTime(),s2 = date2.getTime();
				var total = (s2 - s1)/1000;
				var day = parseInt(total / (24*60*60));//计算整数天数
				this.out.putdya=day
				var hotelfee=this.out.standardprice*day
				this.out.hotelfee=hotelfee
				this.out.shijicost = hotelfee
				var username=this.$getSessionStorage("user")
				this.out.caozuo =username.realname
				this.out.housing =this.out.standardprice
			},
			
			//操作退房
			quit(){
				this.updat.delmark = 0 
				this.out.zhao=this.out.shijifee - this.out.shijicost
				this.stp.out=this.out
				this.stp.updat = this.updat
				console.log(this.stp);
				this.$refs["loginForm"].validate(valid=>{
					if(valid){
						
						let url = "checkout/insert"
						axios.post(url,this.stp).then(resp=>{
							if(resp.data.data == 1){
								//关闭退房窗口
								this.open =false;
							}
						})
					}})
				
			}
		
		}
	}
</script>

<style>
</style>
